$(function () {
 $("#jqGrid").jqGrid({
        url: '../datapayroll/list1',
        datatype: "json",
     colModel : [
         {
             label: '计算月份',
             name : "payrollmonth",
             index : "payrollmonth",
             align : 'center',
             formatter: function(value, options, row){
                 vm.month=value

             },
             hidden:true,
             width : '50'
         },
         {
             label: '工号',
             name : "workNo",
             index : "workNo",
             align : 'center',
             formatter: function(value, options, row){
                 vm.workNo=value

             },
             hidden:true,
             width : '50'
         },
         {
             label: '职位编号',
             name : "jobNo",
             index : "jobNo",
             align : 'center',
             formatter: function(value, options, row){
                 vm.jobNo=value

             },
             hidden:true,
             width : '50'
         },
         {
             label: '姓名',
             name : "name",
             index : "name",
             align : 'center',
             hidden:true,
             formatter: function(value, options, row){
                 vm.name=value

             },
             width : '50'
         }, {
             label: '首月底薪',
             name : "firstmonthwage",
             index : "firstmonthwage",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '80'
         }, {
             label: '底薪',
             name : "monthwage",
             index : "monthwage",
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '端口补贴',
             name : "portfee",
             index : "portfee",
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         },{
             label: '话费补贴',
             name : "mobilefee",
             index : "mobilefee",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '提成',
             name : "businesspromotion",
             index : "businesspromotion",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }					v
             },
             width : '100'
         }, {
             label: '单列',
             name : "separateMoney",
             index : "separateMoney",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '新人推荐',
             name : "newrecommend",
             index : "newrecommend",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '主管直接',
             name : "directordirect",
             index : "directordirect",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '主管间接',
             name : "directorindirect",
             index : "directorindirect",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         },{
             label: '职务津贴',
             name : "joballowance",
             index : "joballowance",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '分店直接',
             name : "branchdirect",
             index : "branchdirect",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '分店间接',
             name : "branchindirect",
             index : "branchindirect",
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '区域直接',
             name : "areadirect",
             index : "areadirect",
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         },{
             label: '区域间接',
             name : "areaindirect",
             index : "areaindirect",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '大区直接',
             name : "bigareadirect",
             index : "bigareadirect",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '大区间接',
             name : "bigareaindirect",
             index : "bigareaindirect",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '100'
         }, {
             label: '社保',
             name : "socialinsurance",
             index : "socialinsurance",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '80'
         }, {
             label: '住房公积金',
             name : "housingfund",
             index : "housingfund",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '60'
         }, {
             label: '加款',
             name : "reward",
             index : "reward",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '60'
         }, {
             label: '扣款',
             name : "punishment",
             index : "punishment",
             align : 'center',
             formatter: function(value, options, row){
                 if(value==0){
                     return 0;
                 }else if(value!=null){
                     return formatCurrency(value)
                 }else{
                     return "";
                 }
             },
             width : '60'
         }, {
             label: '总计',
             name : "totalMoney",
             index : "totalMoney",
             align : 'center',
             hidden:true,
             formatter: function(value, options, row){

                 vm.sum=formatCurrency(value)

             },
             width : '100'
         }],
		viewrecords: true,
        height: 385,
        rowNum: 1,
		rowList : [1,1,1],
        rownumbers: false, 
        rownumWidth: 25, 
        autowidth:true,
        multiselect: false,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },

     gridComplete : function() {
         // 隐藏grid底部滚动条
         $(this).closest(".ui-jqgrid-bdiv").css({
             "overflow-x" : "hidden"
         });
         $(this).jqGrid("setGridWidth", vm.$el.offsetWidth * 1, true);
         $(this).jqGrid("setLabel", 'rn', '序号', {'text-align': 'center'});
     },

    });
});

var vm = new Vue({
	el:'#rrapp',
	data:{
		showList: true,
		month:"",
		name:"",
		jobNo:"",
		workNo:"",
		sum:"",
		payrollone:[]
	},
	methods: {
		query: function () {
			vm.calTime=$("#calTime").val();

			vm.reload();
		},
		getInfo: function(id){
			$.get("../datapayroll/info/"+id, function(r){
				vm.dataPayroll = r.dataPayroll;
			});
		},
		reload: function (event) {
			vm.showList = true;
			var page = $("#jqGrid").jqGrid('getGridParam','page');
			$("#jqGrid").jqGrid('setGridParam',{ 
				/*postData:{'value': vm.value,"calTime":vm.calTime},
                page:page*/
			}).trigger("reloadGrid");
		},
		getUser: function(){

			$.getJSON("../sys/user/info?_"+$.now(), function(r){
				vm.user = r.user;
				vm.payrollone =[];				
				var userId=vm.user.userId;
				$.get("../dictemployee/payrollone/"+userId,
						function(r){

					vm.payrollone = r.payrollone;	            	
					console.log(r)
					initGrid(vm.payrollone);


				})

			});
		}
	},
	created:function(){
		this.getUser();
	}
});
function initGrid(data) {
	console.log(data)
	$("#jqGrid").jqGrid({
		datatype : 'local',
		data: data || [],
		colModel : [
			{
				label: '计算月份',
				name : "payrollmonth",
				index : "payrollmonth",
				align : 'center',
				formatter: function(value, options, row){
					vm.month=value

				},
				hidden:true,
				width : '50'
			},	
			{
				label: '工号',
				name : "workNo",
				index : "workNo",
				align : 'center',
				formatter: function(value, options, row){
					vm.workNo=value

				},
				hidden:true,
				width : '50'
			},
			{
				label: '职位编号',
				name : "jobNo",
				index : "jobNo",
				align : 'center',
				formatter: function(value, options, row){
					vm.jobNo=value

				},
				hidden:true,
				width : '50'
			},
			{
				label: '姓名',
				name : "name",
				index : "name",
				align : 'center',
				hidden:true,
				formatter: function(value, options, row){
					vm.name=value

				},
				width : '50'
			}, {
				label: '首月底薪',
				name : "firstmonthwage",
				index : "firstmonthwage",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '80'
			}, {
				label: '底薪',
				name : "monthwage",
				index : "monthwage",
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}					
				},
				width : '100'
			}, {
				label: '端口补贴',
				name : "portfee",
				index : "portfee",
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}					
				},
				width : '100'
			},{
				label: '话费补贴',
				name : "mobilefee",
				index : "mobilefee",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '提成',
				name : "businesspromotion",
				index : "businesspromotion",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}					v				
				},
				width : '100'
			}, {
				label: '单列',
				name : "separateMoney",
				index : "separateMoney",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '新人推荐',
				name : "newrecommend",
				index : "newrecommend",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}					
				},
				width : '100'
			}, {
				label: '主管直接',
				name : "directordirect",
				index : "directordirect",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '主管间接',
				name : "directorindirect",
				index : "directorindirect",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}								
				},
				width : '100'
			},{
				label: '职务津贴',
				name : "joballowance",
				index : "joballowance",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '分店直接',
				name : "branchdirect",
				index : "branchdirect",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '分店间接',
				name : "branchindirect",
				index : "branchindirect",
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '区域直接',
				name : "areadirect",
				index : "areadirect",
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			},{
				label: '区域间接',
				name : "areaindirect",
				index : "areaindirect",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '大区直接',
				name : "bigareadirect",
				index : "bigareadirect",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '100'
			}, {
				label: '大区间接',
				name : "bigareaindirect",
				index : "bigareaindirect",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}								
				},
				width : '100'
			}, {
				label: '社保',
				name : "socialinsurance",
				index : "socialinsurance",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}								
				},
				width : '80'
			}, {
				label: '住房公积金',
				name : "housingfund",
				index : "housingfund",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '60'
			}, {
				label: '加款',
				name : "reward",
				index : "reward",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '60'
			}, {
				label: '扣款',
				name : "punishment",
				index : "punishment",
				align : 'center',
				formatter: function(value, options, row){
					if(value==0){
						return 0;
					}else if(value!=null){
						return formatCurrency(value)
					}else{
						return "";
					}									
				},
				width : '60'
			}, {
				label: '总计',
				name : "totalMoney",
				index : "totalMoney",
				align : 'center',
				hidden:true,
				formatter: function(value, options, row){

					vm.sum=formatCurrency(value)

				},
				width : '100'
			}],
			multiselect : false,
			height: 385,
			gridComplete : function() {
				// 隐藏grid底部滚动条
				$(this).closest(".ui-jqgrid-bdiv").css({
					"overflow-x" : "hidden"
				});
				$(this).jqGrid("setGridWidth", vm.$el.offsetWidth * 1, true);
				$(this).jqGrid("setLabel", 'rn', '序号', {'text-align': 'center'});
			},
			rownumbers: false,
			rownumWidth: 40,
	});
}

function formatCurrency(num) 
{
	if(num)
	{
		//将num中的$,去掉，将num变成一个纯粹的数据格式字符串
		num = num.toString().replace(/\$|\,/g,'');
		//如果num不是数字，则将num置0，并返回
		if(''==num || isNaN(num)){return 'Not a Number ! ';}
		//如果num是负数，则获取她的符号
		var sign = num.indexOf("-")> 0 ? '-' : '';
		//如果存在小数点，则获取数字的小数部分
		var cents = num.indexOf(".")> 0 ? num.substr(num.indexOf(".")) : '';
		cents = cents.length>1 ? cents : '' ;//注意：这里如果是使用change方法不断的调用，小数是输入不了的
		//获取数字的整数数部分
		num = num.indexOf(".")>0 ? num.substring(0,(num.indexOf("."))) : num ;
		//如果没有小数点，整数部分不能以0开头
		if('' == cents){ if(num.length>1 && '0' == num.substr(0,1)){return 'Not a Number ! ';}}
		//如果有小数点，且整数的部分的长度大于1，则整数部分不能以0开头
		else{if(num.length>1 && '0' == num.substr(0,1)){return 'Not a Number ! ';}}
		//针对整数部分进行格式化处理，这是此方法的核心，也是稍难理解的一个地方，逆向的来思考或者采用简单的事例来实现就容易多了
		/*
               也可以这样想象，现在有一串数字字符串在你面前，如果让你给他家千分位的逗号的话，你是怎么来思考和操作的?
               字符串长度为0/1/2/3时都不用添加
               字符串长度大于3的时候，从右往左数，有三位字符就加一个逗号，然后继续往前数，直到不到往前数少于三位字符为止
		 */
		for (var i = 0; i < Math.floor((num.length-(1+i))/3); i++)
		{
			num = num.substring(0,num.length-(4*i+3))+','+num.substring(num.length-(4*i+3));
		}
		//将数据（符号、整数部分、小数部分）整体组合返回
		return (sign + num + cents);    
	}

}